<template>
	<section>
		<!--工具条-->
		<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
			<el-form :inline="true" :model="filters">
				<el-form-item>
					<el-button type="primary" v-on:click="showaddform">增加职务</el-button>
				</el-form-item>
			</el-form>
		</el-col>
		<!--列表-->
		<el-table :data="positions" highlight-current-row v-loading="listLoading" @selection-change="selsChange" style="width: 100%;">
			<el-table-column prop="dictName" label="职务名称" sortable>
			</el-table-column>
			<el-table-column prop="id" label="编号" sortable>
			</el-table-column>
			<el-table-column label="操作" width="150">
				<template slot-scope="scope">
					<el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
					<el-button type="danger" size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
				</template>
			</el-table-column>
		</el-table>

		<!--工具条-->
		<el-col :span="24" class="toolbar">
			<el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="20" :total="total" style="float:right;">
			</el-pagination>
		</el-col>

		<!--增加职务-->
		<el-dialog title="增加职务" :visible.sync="editFormVisible" :close-on-click-modal="false">
			<el-form :inline="true" ref="addForm" :model="addForm" :rules="addFormRules" label-width="90px">
				<el-form-item label="职务名称">
					<el-input v-model="addForm.dictName"></el-input>
				</el-form-item>
				<br>
				
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click.native="editFormVisible = false">取消</el-button>
				<el-button type="primary" @click.native="editSubmit" :loading="editLoading">提交</el-button>
			</div>
		</el-dialog>
	</section>
</template>

<script>
export default {
  name:'reposition',
  data(){
    return {
			filters:{},
      positions:[],
      selsChange:[],
      editFormVisible:false,
      editLoading:false,
      listLoading:false,
      total:0,
			page:0,
			addForm:{
				id:'',
				dictType:2,
				dictName:''
			},
			addFormRules:{
				name:[
					{required: true, message:'请输入名称', trigger: 'blur'}
				],
			}
    }
  },
  methods:{
    handleCurrentChange(val) {
				this.page = val;
				this.getPositions();
    },
    getPositions(){
      let para = {
        dictType: 2,
        pageNum:10,
        pageSize:this.page
      };
      this.listLoading = true;
      this.axios.get('/referee/manage/dict/list',{params: para})
      .then((result) => {
        this.listLoading = false;
        if(result.data.code === '0000'){
          this.positions = result.data.data.list;
          this.total = result.data.data.total
        }else{
          console.log(result);
        }
      }).catch((err) => {
        
      });
    },
    showaddform(){
			this.editFormVisible = true;
			this.addForm.dictName = '';
			this.addForm.id = '';
		},
		handleEdit(index, row){
			this.editFormVisible =true;
			this.addForm.dictName = row.dictName;
			this.addForm.id = row.id;
		},
		handleDel(index, row){
			this.$confirm('确认删除该条记录吗', '提示', {
				type: 'warning'
			}).then(()=>{
				this.axios.delete(`/referee/manage/dict/${row.id}`)
				.then((res) => {
					if(res.data.code ==='0000'){
						this.$message('删除成功','success');
						this.getlevel();
					}
				}).catch((err) => {
					
				});
			}).catch(()=>{

			});
			
		},
    editSubmit(){
			this.$refs.addForm.validate((valid)=>{
				if(valid){
					if(this.addForm.id){
						this.axios.put('/referee/manage/dict', JSON.stringify(this.addForm))
						.then((res) => {
							if(res.data.code === '0000'){
								this.$message('修改成功','success');
								this.$refs.addForm.clearValidate();
								this.editFormVisible = false;
								this.getlevel();
							}
						}).catch((err) => {
							
						});
					}else{
						this.axios.post('/referee/manage/dict', JSON.stringify(this.addForm))
						.then((res) => {
							if(res.data.code === '0000'){
								this.$message('添加成功','success');
								this.$refs.addForm.clearValidate();
								this.editFormVisible = false;
								this.getlevel();
							}
						}).catch((err) => {
							
						});
					}
					
				}
			})
    }
  },
  mounted(){
    this.getPositions()
  }
}
</script>

<style>

</style>
